<template>
  <div class="container">
    <el-container style="height: 100%; border: 1px solid #eee">
      <!--顶部header-->
      <el-header style="text-align: right; font-size: 12px">
        <el-dropdown>
          <i class="el-icon-setting" style="margin-right: 15px"></i>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>查看</el-dropdown-item>
            <el-dropdown-item>新增</el-dropdown-item>
            <el-dropdown-item>删除</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <span>王小虎</span>
      </el-header>

      <el-container>
        <!--左侧菜单-->
        <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
          <el-menu
            :default-active="onRoutes"
            :default-openeds="[sidebarData[0].key]"
            v-for="(item,index) in sidebarData"
            :key="item.key +index"
            unique-opened
            router
          >
            <el-submenu :index="item.key">
              <template slot="title"><i class="el-icon-message"></i>{{ item.title }}</template>
              <el-menu-item-group v-for="(item2,index2) in item.sub_list" :key="item2.key +index2">
                <!--                <template slot="title">{{ item.title }}</template>-->
                <el-menu-item :index="item2.key">{{ item2.title }}</el-menu-item>
              </el-menu-item-group>
            </el-submenu>
          </el-menu>
        </el-aside>
        <!--功能页面-->
        <el-main>
          <transition name="move" mode="out-in">
            <keep-alive :include="tagsList">
              <router-view></router-view>
            </keep-alive>
          </transition>
        </el-main>
      </el-container>
    </el-container>

  </div>
</template>

<script>
import { goNext } from "@/utils/basisFun";
import sidebarConfig from "@/views/projectTypes/discountTicket/sidebarConfig";

export default {
  name: "discountTicket",
  data() {

    return {
      sidebarData: sidebarConfig.sidebarData,
      tagsList: []
    };
  },
  computed: {
    onRoutes() {
      return this.$route.path.replace('/', '')
    }
  },
  created() {
    console.log(this.$router);
  },
  methods: {
    goNextPage() {
      const params = {
        testHome: 1
      };
      goNext("/discountTicketDetail", params);
      // this.$router.push({
      //   path: "/discountTicketDetail",
      //   query: {
      //     ...params,
      //   },
      // });
    }
  }
};
</script>

<style scoped>
.container {
  width: 100%;
  height: 100%;
}

.el-header {
  background-color: #B3C0D1;
  color: #333;
  line-height: 60px;
}

.el-aside {
  color: #333;
}
</style>
